<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="viewport" content="width=device-width" />
    <title>Pyroscope</title>
    <link rel="stylesheet" href="/assets/styles.<%= webpack.hash %>.css" />
    {{- if .BaseURL }}
    <base href="{{ .BaseURL }}" />
    {{- end }}
    <link rel="icon" href="/assets/images/favicon.ico" />
  </head>

  <body class="login-page">
    <div class="bg-2"></div>
    <section class="login-form">
      <div class="welcome-logo"></div>
      <h1 class="welcome-title">Welcome to Pyroscope</h1>
      {{if or .GoogleEnabled .GithubEnabled .GitlabEnabled}}
      <p class="login-to-continue">Log in to continue</p>
      <div class="sign-in-buttons">
        {{if .GoogleEnabled}}
        <a
          id="google-link"
          href="/auth/google/login"
          class="sign-in-button sign-in-button-google"
        >
          <svg
            aria-hidden="true"
            focusable="false"
            data-prefix="fab"
            data-icon="google"
            role="img"
            xmlns="http://www.w3.org/2000/svg"
            viewBox="0 0 488 512"
            class="svg-inline--fa fa-google fa-w-16 fa-9x"
          >
            <path
              fill="currentColor"
              d="M488 261.8C488 403.3 391.1 504 248 504 110.8 504 0 393.2 0 256S110.8 8 248 8c66.8 0 123 24.5 166.3 64.9l-67.5 64.9C258.5 52.6 94.3 116.6 94.3 256c0 86.5 69.1 156.6 153.7 156.6 98.2 0 135-70.4 140.8-106.9H248v-85.3h236.1c2.3 12.7 3.9 24.9 3.9 41.4z"
              class=""
            ></path>
          </svg>
          <span>Sign in with Google</span>
        </a>
        {{end}} {{if .GithubEnabled}}
        <a
          id="github-link"
          href="/auth/github/login"
          class="sign-in-button sign-in-button-github"
        >
          <svg
            aria-hidden="true"
            focusable="false"
            data-prefix="fab"
            data-icon="github"
            role="img"
            xmlns="http://www.w3.org/2000/svg"
            viewBox="0 0 496 512"
            class="svg-inline--fa fa-github fa-w-16 fa-9x"
          >
            <path
              fill="currentColor"
              d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"
              class=""
            ></path>
          </svg>
          <span>Sign in with GitHub</span>
        </a>
        {{end}} {{if .GitlabEnabled}}
        <a
          id="gitlab-link"
          href="/auth/gitlab/login"
          class="sign-in-button sign-in-button-gitlab"
        >
          <svg
            aria-hidden="true"
            focusable="false"
            data-prefix="fab"
            data-icon="gitlab"
            role="img"
            xmlns="http://www.w3.org/2000/svg"
            viewBox="0 0 512 512"
            class="svg-inline--fa fa-gitlab fa-w-16 fa-9x"
          >
            <path
              fill="currentColor"
              d="M105.2 24.9c-3.1-8.9-15.7-8.9-18.9 0L29.8 199.7h132c-.1 0-56.6-174.8-56.6-174.8zM.9 287.7c-2.6 8 .3 16.9 7.1 22l247.9 184-226.2-294zm160.8-88l94.3 294 94.3-294zm349.4 88l-28.8-88-226.3 294 247.9-184c6.9-5.1 9.7-14 7.2-22zM425.7 24.9c-3.1-8.9-15.7-8.9-18.9 0l-56.6 174.8h132z"
              class=""
            ></path>
          </svg>
          <span>Sign in with GitLab</span>
        </a>
        {{end}}
      </div>
      {{else}}
      <p class="login-to-continue">
        No authentication methods are set up. Visit
        <a href="https://pyroscope.io/docs/auth-google" target="_blank"
          >documentation</a
        >
        for more information on how to set it up.
      </p>
      <div class="sign-in-buttons">
        <a href="/" class="sign-in-button sign-in-button-go-back">
          <svg
            aria-hidden="true"
            focusable="false"
            data-prefix="fas"
            data-icon="arrow-circle-left"
            role="img"
            xmlns="http://www.w3.org/2000/svg"
            viewBox="0 0 512 512"
            class="svg-inline--fa fa-arrow-circle-left fa-w-16 fa-9x"
          >
            <path
              fill="currentColor"
              d="M256 504C119 504 8 393 8 256S119 8 256 8s248 111 248 248-111 248-248 248zm28.9-143.6L209.4 288H392c13.3 0 24-10.7 24-24v-16c0-13.3-10.7-24-24-24H209.4l75.5-72.4c9.7-9.3 9.9-24.8.4-34.3l-11-10.9c-9.4-9.4-24.6-9.4-33.9 0L107.7 239c-9.4 9.4-9.4 24.6 0 33.9l132.7 132.7c9.4 9.4 24.6 9.4 33.9 0l11-10.9c9.5-9.5 9.3-25-.4-34.3z"
              class=""
            ></path>
          </svg>
          <span>Go back to main page</span>
        </a>
      </div>
      {{end}}
    </section>

    <script>
      setTimeout(function () {
        document.querySelector('.bg-2').classList.add('fade-out');
      }, 100);
      var has_tls = location.protocol === 'https:';

      ['google', 'github', 'gitlab'].forEach(function (x) {
        var el = document.querySelector('#' + x + '-link');
        if (el) {
          el.href += '?tls=' + has_tls;
        }
      });
    </script>
  </body>
</html>
